
<template>
  <div class="app-container">
    <!-- <PanelGroup :numList='statistics'></PanelGroup> -->
    <el-row style="background:#fff;margin-top: 30px;" :gutter="20">
      <el-col style="margin-bottom: 20px;">
        <el-card class="box-card">
          <Line-chart :chart-data="statistics" />
        </el-card>
      </el-col>
      <!-- <el-col>
        <el-card class="box-card">
          <Area-chart :chart-data="statistics['金额统计饼图']" />
        </el-card>
      </el-col> -->
    </el-row>
  </div>
</template>
<script>

export default {
  name: "Dashboard"
}
</script>
<script setup>
import { attendanceGroupBy } from '@/api/api';
import PanelGroup from './components/PanelGroup.vue';
import AreaChart from './components/areaChart.vue';
import LineChart from './components/lineChart.vue';
import { onMounted, reactive, ref } from 'vue'
import { useAccount } from '@/pinia/modules/account';
let statistics = ref({})
listFn()
async function listFn() {
  const { userinfo } = useAccount()
  let { data } = await attendanceGroupBy({
    jobNumber: userinfo.jobNumber,
    by: ['year', 'month']
  })
  statistics.value = data
}


</script>